<template>
  <div>
      <button v-if="isShow" @click="fn">点击搜索</button>
      <input type="text" v-else ref="inp">
  </div>
</template>

<script>
export default {
    data(){
        return{
            isShow:true
        }
    },
    methods: {
        fn(){
            this.isShow=false
            //此时DOM还没有更新 获取不到真实的DOM
            // this.$refs.inp
            this.$nextTick(()=>{
            // console.log(this.$refs.inp);
                this.$refs.inp.focus()
            })
        }
    }
}
</script>

<style>

</style>